<div class="wrapper wrapper-content" ng-controller="WorkingCalendarMasterController">
	<div class="row">
		<div class="col-lg-12">
			<div class="tabs-container">
				<uib-tabset>
					<uib-tab heading="{{'COMMON.WORKING_CALENDAR' | translate}}" >
						<div class="panel-body" ng-controller="WorkingCalendarController">
							<a ng-click="addWorkingCalendar()" class="btn btn-primary btn-rounded btn-outline" href=""><i class="fa fa-plus-circle"></i> {{'WORKING_CALENDAR.ADD_WORKING_CALENDAR' | translate}}</a>
							<a ng-click="importWorkingCalendar()" class="btn btn-primary btn-rounded  btn-outline" href=""><i class="fa fa-plus-circle"></i> {{'SETTING.IMPORT' | translate}}</a>
							<table class="footable table table-bordered table-hover" data-sort="true" data-page-size="15">
								<thead>
									<tr>
										<th class="text-center" data-type="numeric">{{'SETTING.ID' | translate}}</th>
										<th class="text-center">{{'SETTING.NAME' | translate}}</th>
										<th class="text-center">{{'SETTING.DESCRIPTION' | translate}} ({{'SETTING.OPTIONAL' | translate}})</th>
										<th class="text-center">{{'SETTING.ACTION' | translate}}</th>
									</tr>
								</thead>
								<tbody>
									<tr ng-repeat="workingcalendar in workingcalendars">
										<td class="text-center">{{ workingcalendar.id }}</td>
										<td class="text-center">{{ workingcalendar.name }}</td>
										<td class="text-center">{{ workingcalendar.description}}</td>
										<td class="text-center">
											<a class="btn btn-primary btn-rounded btn-xs" ng-click="editWorkingCalendar(workingcalendar)" >{{'SETTING.EDIT' | translate}}</a>
											<a ng-click="deleteWorkingCalendar(workingcalendar)" class="btn btn-danger btn-rounded btn-xs" >{{'SETTING.DELETE' | translate}}</a>
											<a ng-click="exportWorkingCalendar(workingcalendar)" class="btn btn-danger btn-rounded btn-xs" >{{'SETTING.EXPORT' | translate}}</a>
											<a ng-click="cloneWorkingCalendar(workingcalendar)" class="btn btn-danger btn-rounded btn-xs" >{{'SETTING.CLONE' | translate}}</a>
										</td>
									</tr>
								</tbody>
								<tfoot class="hide-if-no-paging">
									<tr>
										<td colspan="6">
											<ul class="pagination pull-right"></ul>
										</td>
									</tr>
								</tfoot>
							</table>
						</div>
					</uib-tab>
					<uib-tab heading="{{'SETTING.NON_WORKING_DAY' | translate}}">
						<div class="panel-body" ng-controller="WorkingCalendarNonWorkingDayController">
							<form method="get" class="form-horizontal">
								<div class="form-group"><label
										class="col-sm-2 control-label">{{'WORKING_CALENDAR.SELECT_WORKING_CALENDAR' | translate}}:</label>
									<div class="col-sm-3">
										<ui-select on-select="changeWorkingCalendar($item, $model)"
											ng-model="currentWorkingCalendar" theme="bootstrap">
											<ui-select-match placeholder="{{'COMMON.PLACEHOLDER' | translate}}">
												{{$select.selected.name}}</ui-select-match>
											<ui-select-choices
												repeat="workingcalendar.id as workingcalendar in workingcalendars | filter: $select.search">
												<div ng-bind-html="workingcalendar.name | highlight: $select.search"></div>
											</ui-select-choices>
										</ui-select>
									</div>
								</div>
							</form>
							<div class="hr-line-dashed"></div>
							<a ng-click="currentWorkingCalendar.id?addNonWorkingDay():''" ng-disabled="!currentWorkingCalendar.id" class="btn btn-primary btn-rounded  btn-outline" href=""><i
									class="fa fa-plus-circle"></i> {{'SETTING.ADD_NON_WORKING_DAY' | translate}}</a>
							<table class="footable table table-bordered table-hover" data-sort="true" data-page-size="15">
								<thead>
									<tr>
										<th class="text-center" data-type="numeric">{{'SETTING.ID' | translate}}</th>
										<th class="text-center">{{'WORKING_CALENDAR.DATE' | translate}}</th>
										<th class="text-center">{{'SETTING.DESCRIPTION' | translate}} ({{'SETTING.OPTIONAL' | translate}})</th>
										<th class="text-center">{{'SETTING.ACTION' | translate}}</th>
									</tr>
								</thead>
								<tbody>
									<tr ng-repeat="nonworkingday in nonworkingdays">
										<td class="text-center">{{ nonworkingday.id }}</td>
										<td class="text-center">{{ nonworkingday.date_local }}</td>
										<td class="text-center">{{ nonworkingday.description}}</td>
										<td class="text-center">
											<a ng-click="editNonWorkingDay(nonworkingday)"
												class="btn btn-primary btn-rounded btn-xs">{{'SETTING.EDIT' | translate}}</a>
											<a ng-click="deleteNonWorkingDay(nonworkingday)"
												class="btn btn-danger btn-rounded btn-xs">{{'SETTING.DELETE' | translate}}</a>
										</td>
									</tr>
								</tbody>
								<tfoot class="hide-if-no-paging">
									<tr>
										<td colspan="6">
											<ul class="pagination pull-right"></ul>
										</td>
									</tr>
								</tfoot>
							</table>
						</div>
					</uib-tab>
				</uib-tabset>
			</div>
		</div>
	</div>
</div>
